import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:short_video_app/entity/home/comment_list_entity.dart';
import 'package:short_video_app/entity/home/video_list_entity.dart';
import 'package:short_video_app/utils/color_util.dart';
import 'package:short_video_app/utils/date_util.dart';
import 'package:short_video_app/ui/widgets/custom_network_image.dart';
import 'package:short_video_app/ui/widgets/empty_page.dart';
import 'package:short_video_app/ui/widgets/custom_refresh.dart';
import 'package:short_video_app/view_model/home/comment_video_view_model.dart';

class CommentVideoPage extends StatefulWidget {
  final VideoEntity? entity;

  const CommentVideoPage({Key? key, this.entity}) : super(key: key);

  @override
  State<CommentVideoPage> createState() => _CommentVideoPageState();
}

class _CommentVideoPageState extends State<CommentVideoPage> {
  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider(
      create: (BuildContext context) => CommentVideoViewModel(videoEntity: widget.entity),
      child: Consumer<CommentVideoViewModel>(builder: (context, viewModel, child) {
        return CustomRefresh(
          controller: viewModel.refreshController,
          enablePullUp: true,
          onRefresh: () async {
            viewModel.onRefresh();
          },
          onLoading: () async {
            viewModel.onLoading();
          },
          child: _buildContent(viewModel),
        );
      })
    );
  }

  Widget _buildContent(CommentVideoViewModel viewModel) {
    return
      viewModel.datas.isEmpty
        ? const EmptyPage()
        : ListView.builder(
            scrollDirection: Axis.vertical,
            itemCount: viewModel.datas.length,
            padding: EdgeInsets.zero,
            primary: true,
            itemBuilder: (BuildContext context, int index) {
              return _buildCommentItem(context, viewModel, index);
            },
          );
  }

  Widget _buildCommentItem(BuildContext context, CommentVideoViewModel viewModel, int index) {
    CommentEntity commentEntity = viewModel.datas[index];
    return GestureDetector(
      child: Column(
        children: [
          Container(
            width: double.infinity,
            padding: const EdgeInsets.only(top: 15, bottom: 15),
            child: Row(
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                ClipRRect(
                  borderRadius: BorderRadius.circular(25),
                  child: Container(
                    color: ColorsUtil.COLOR_DBDBDB,
                    width: 50,
                    height: 50,
                    child: const CustomNetworkImage(
                      url: 'https://img1.baidu.com/it/u=1773366646,898438994&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=889',
                      fit: BoxFit.cover,
                      logoSize: Size(25, 25),
                    ),
                  ),
                ),
                const SizedBox(width: 20),
                Expanded(
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Text(
                        commentEntity.nickName ?? "",
                        style: const TextStyle(fontSize: 14, color: ColorsUtil.COLOR_FF5C5C),
                        maxLines: 1,
                        overflow: TextOverflow.ellipsis,
                      ),
                      Text(
                        commentEntity.content ?? "",
                        style: const TextStyle(fontSize: 14, fontWeight: FontWeight.bold, color: ColorsUtil.COLOR_333333),
                        maxLines: 2,
                        overflow: TextOverflow.ellipsis,
                      ),
                      const SizedBox(height: 15),
                      Align(
                        alignment: Alignment.centerRight,
                        child: Text(
                          DateUtil.yearMonthDdayHourMinute(commentEntity.createTime ?? 0),
                          style: const TextStyle(fontSize: 12, color: ColorsUtil.COLOR_999999),
                          maxLines: 1,
                          overflow: TextOverflow.ellipsis,
                        ),
                      )

                    ],
                  )
                )
              ],
            ),
          ),
          index != viewModel.datas.length-1
            ? Container(height: 0.5, color: ColorsUtil.COLOR_DBDBDB)
            : Container(),
        ],
      ),
      behavior: HitTestBehavior.opaque,
      onTap: () {
        // TODO(回复评论)
      },
    );
  }
}
